*{
    padding: 0;
    margin:0;
}
.box{
    width: 470px;
    height:500px;
    position: relative;
    /*background-color: orange;*/
    animation: rot 2s linear Infinite ;
}
.box div{
    width:215px;
    height:170px;
    border-radius: 107px 0 0 0;
    position: absolute;
    top: 108px;
    left:0;
    transform-origin: right bottom;
}
.box div:nth-of-type(1){
    background-color: red;
    transform:rotate(15deg);
}.box div:nth-of-type(2){
    background-color: blue;
     transform:rotate(105deg);
}.box div:nth-of-type(3){
    background-color: pink;
      transform:rotate(195deg);
}.box div:nth-of-type(4){
    background-color: green;
       transform:rotate(285deg);
}

 @keyframes rot {
     100%{
         transform: rotate(360deg);
     }
 }
 .box p{
     width:80px;
     height:80px;
     background-color: aqua;
     text-align: center;
     line-height: 80px;
     color: #fff;
     font-size:50px;
     border-radius:50%;
     opacity:0.8;
     position: absolute;
     left:175px;
     top:235px;
}